<template>
  <div>
    <div class="main">
      <div class="top-basic">
        <div class="new">
          <van-icon name="bullhorn-o icon-size-class" dot/>
          <van-icon name="plus icon-size-class ml-16" />
        </div>
        <div class="name mb-8">
          Hi! 老王
        </div>
        <div>2019年11月28日，星期四</div>
      </div>
      <div class="van-hairline--bottom"></div>
      <div class="todo">
        <div class="flex-between">
          <div style="font-size: 16PX">待办事项</div>
          <div class="color-link">
            <i class="far fa-calendar-alt"></i>
            <span class="ml-8">工作日历</span>
          </div>
        </div>
      </div>

      <van-swipe :autoplay="3000" indicator-color="white">
        <van-swipe-item v-for="(item,index) in projectList" :key="index" v-if="item.imageId">
          <van-image
            width="100%"
            height="375px"
            fit="contain"
            :src="$global.filePath+'/blade-resource/oss/file/image/graphic/1X1_0_0_0/'+item.imageId"
          />
        </van-swipe-item>
      </van-swipe>
    </div>
    <van-tabbar v-model="active">
      <van-tabbar-item icon="home-o" to="/home">首页</van-tabbar-item>
      <van-tabbar-item icon="cluster-o" to="/TrackManage">轨道管理</van-tabbar-item>
      <van-tabbar-item icon="bar-chart-o" to="/report">报表</van-tabbar-item>
      <van-tabbar-item icon="user-o" to="/my">我的</van-tabbar-item>
    </van-tabbar>
  </div>
</template>

<script>
  import {getList} from "@/api/track_project/trackproject";
  export default {
    name: "home",
    data(){
      return{
        active:0,
        projectList:[]
      }
    },
    mounted(){
      this.loadProject();

    },
    methods: {
      //项目列表接口
      loadProject() {
        getList(1, 8, this.query).then(res => {
          const data = res.data.data;
          this.projectList = data.records;
        });
      },
    }
  }
</script>

<style scoped lang="less">
  .main{
    margin-top:11px;
    .top-basic{
      background: #fff;
      padding: 16px 16px;
      .new{
        height: 44px;
        display: flex;
        justify-content: flex-end;
        align-items: center;
      }
      .name{
        font-size: 34PX;
      }
    }
    .todo{
      background: #fff;
      padding: 16px 16px;
    }
  }
</style>